import React from "react";

import ProfilePageFunction from './ProfilePageFunction';
import ProfilePageClass from './ProfilePageClass';

class App extends React.Component {
  state = {
    user: '凌云',
  };
  render() {
    return (
      <>
        <label>
          <b>选择你想浏览的主页: </b>
          <select
            value={this.state.user}
            onChange={e => this.setState({ user: e.target.value })}
          >
            <option value="凌云">凌云</option>
            <option value="晓林">晓林</option>
            <option value="江江">江江</option>
          </select>
        </label>
        <h1>欢迎来到 {this.state.user}的 个人主页!</h1>
        <p>
          <ProfilePageFunction user={this.state.user} />
          <b> (function组件)</b>
        </p>
        <p>
          <ProfilePageClass user={this.state.user} />
          <b> (class组件)</b>
        </p>
      </>
    )
  }
}
export default App;

